import React from 'react'
import PropTypes from 'prop-types'
import { routerRedux } from 'dva/router'
import { connect } from 'dva'
import { Row, Col, Button, Popconfirm } from 'antd'
import { List, Page } from 'components'
import queryString from 'query-string'
import Filter from './Filter'

import { ListMenuType } from 'utils/enums'

const CompanyAccountsStatistics = ({ location, dispatch, companyAccountsStatistics, loading }) => {
  location.query = queryString.parse(location.search)
  const { list, pagination, currentItem, companyAccount, selectedRowKeys, companyChargeType, currenciesCodeData } = companyAccountsStatistics
  const { pageSize } = pagination

  // 列表属性
  const listProps = {
    dataSource: list,
    menuType: ListMenuType.MENU_UPDATE + ListMenuType.MENU_DELETE,
    loading: loading.effects['companyAccountsStatistics/list'], // 进入路由就要请求一个list
    pagination,
    location,
    columnsData: [
      {
        title: 'AccountID',
        dataIndex: 'accountId',
        key: 'accountId',
      },
      {
        title: 'accountSum',
        dataIndex: 'accountSum',
        key: 'accountSum',
      },
      {
        title: 'type',
        dataIndex: 'type',
        key: 'type',
      },
      {
        title: 'detailAccountSum',
        dataIndex: 'detailAccountSum',
        key: 'detailAccountSum',
      },
      {
        title: 'currencyCode',
        dataIndex: 'currencyCode',
        key: 'currencyCode',
      },

    ],
    onChange (page) {
      const { query, pathname } = location
      dispatch(routerRedux.push({
        pathname,
        search: queryString.stringify({
          ...query,
          page: page.current,
          pageSize: page.pageSize,
        }),
      }))
    },
    onDeleteItem (id) {
      dispatch({
        type: 'customer/delete',
        payload: id,
      })
    },
    onEditItem (item) {
      dispatch(routerRedux.push({
        pathname: `customer/detail/${item.id}`,
      }))
    },
    rowSelection: {
      selectedRowKeys,
      onChange: (keys) => {
        dispatch({
          type: 'customer/updateState',
          payload: {
            selectedRowKeys: keys,
          },
        })
      },
    },
  }
   console.log()
  const filterProps = {
    filter: {
      ...location.query,
      companyAccount,
      companyChargeType,
      currenciesCodeData,
    },

    onFilterChange (value) {
      dispatch(routerRedux.push({
        pathname: location.pathname,
        search: queryString.stringify({
          ...value,
          page: 1,
          pageSize,
        }),
      }))
    },
    onSearch (fieldsValue) {
      fieldsValue.keyword.length ? dispatch(routerRedux.push({
        pathname: '/companyAccountsStatistics',
        query: {
          field: fieldsValue.field,
          keyword: fieldsValue.keyword,
        },
      })) : dispatch(routerRedux.push({
        pathname: '/companyAccountsStatistics',
      }))
    },
  }
  return (
    <Page inner>
      <Filter {...filterProps} />
      <List {...listProps} />
    </Page>
  )
}

CompanyAccountsStatistics.propTypes = {
  companyAccountsStatistics: PropTypes.object,
  location: PropTypes.object,
  dispatch: PropTypes.func,
  loading: PropTypes.object,
}

export default connect(({ companyAccountsStatistics, loading }) => ({ companyAccountsStatistics, loading }))(CompanyAccountsStatistics)
